<template>
	<view class="login-box">
		<!-- <view class="uni-header">
			<view class="uni-group">
				<view class="uni-title">创建超级管理员</view>
			</view>
		</view>
		<view class="uni-container">
			<uni-forms ref="form" validateTrigger="bind" :rules="rules" @submit="submit">
				<uni-forms-item left-icon="person" name="username" labelWidth="35">
					<input ref="usernameInput" class="uni-input-border" type="text" placeholder="账户"
						@blur="binddata('username',$event.detail.value)" />
				</uni-forms-item>

				<uni-forms-item left-icon="locked" name="password" labelWidth="35">
					<input class="uni-input-border" :password="showPassword" placeholder="密码"
						@blur="binddata('password',$event.detail.value)" />
					<text class="uni-icon-password-eye pointer" :class="[!showPassword ? 'uni-eye-active' : '']"
						@click="changePassword">&#xe568;</text>
				</uni-forms-item>

				<uni-forms-item left-icon="locked" name="passwordConfirmation" labelWidth="35"
					:errorMessage="errorMessage">
					<input ref="passwordInput" @confirm="confirmForm('passwordConfirmation',$event.detail.value)"
						@blur="binddata('passwordConfirmation',$event.detail.value)" class="uni-input-border"
						:password="showPasswordAgain" placeholder="确认密码" />
					<text class="uni-icon-password-eye pointer" :class="[!showPasswordAgain ? 'uni-eye-active' : '']"
						@click="changePasswordAgain">&#xe568;</text>
				</uni-forms-item>
				<view class="uni-group" style="margin-top: 30px;">
					<button class="uni-button" type="primary" :loading="loading" :disabled="loading"
						@click="submitForm">创建</button>
					<button class="uni-button" type="default" @click="back">返回</button>
				</view>

			</uni-forms>
		</view> -->
		<!-- #ifndef H5 -->
		<fix-window />
		<!-- #endif -->
	</view>
</template>
<script>
	// import {
	// 	mapMutations,
	// 	mapActions,
	// 	mapState
	// } from 'vuex'
	// import config from '@/admin.config.js'
	// export default {
	// 	data() {
	// 		return {
	// 			showPassword: true,
	// 			showPasswordAgain: true,
	// 			loading: false,
	// 			errorMessage: '',
	// 			formData: {
	// 				username: 'admin',
	// 				password: ''
	// 			},
	// 			passwordConfirmation: '',
	// 			rules: {
	// 				// 对name字段进行必填验证
	// 				username: {
	// 					rules: [{
	// 							required: true,
	// 							errorMessage: '请输入账户',
	// 						},
	// 						{
	// 							minLength: 3,
	// 							maxLength: 30,
	// 							errorMessage: '账户长度在{minLength}到{maxLength}个字符'
	// 						}
	// 					]
	// 				},
	// 				// 对email字段进行必填验证
	// 				password: {
	// 					rules: [{
	// 							required: true,
	// 							errorMessage: '请输入密码',
	// 						},
	// 						{
	// 							minLength: 6,
	// 							errorMessage: '密码长度大于{minLength}个字符'
	// 						}
	// 					]
	// 				},
	// 				passwordConfirmation: {
	// 					rules: [{
	// 							required: true,
	// 							errorMessage: '请输入确认密码',
	// 						},
	// 						{
	// 							minLength: 6,
	// 							errorMessage: '密码长度最小{minLength}个字符'
	// 						}
	// 					]
	// 				}
	// 			}
	// 		}
	// 	},
	// 	mounted() {
	// 		// #ifdef H5
	// 		// #ifndef VUE3
	// 		this.focus()
	// 		// #endif
	// 		// #endif
	// 	},
	// 	computed: {
	// 		...mapState('app', ['appName', 'appid'])
	// 	},
	// 	methods: {
	// 		...mapMutations({
	// 			setToken(commit, tokenInfo) {
	// 				commit('user/SET_TOKEN', tokenInfo)
	// 			}
	// 		}),
	// 		register(formData) {
	// 			// #ifdef H5
	// 			// #ifndef VUE3
	// 			this.$refs.passwordInput.$refs.input.blur()
	// 			// #endif
	// 			// #endif
	// 			this.loading = true
	// 			this.$request('registerAdmin', formData, {
	// 				functionName: 'uni-id-cf'
	// 			}).then(res => {
	// 				uni.showModal({
	// 					title: '提示',
	// 					content: res.code ? res.message : '创建成功',
	// 					showCancel: false,
	// 					success: (res) => {
	// 						if (res.confirm) {
	// 							uni.navigateTo({
	// 								url: '/pages/login/login'
	// 							})
	// 						}
	// 					}
	// 				})
	// 			}).catch(err => {}).finally(err => {
	// 				this.loading = false
	// 			})
	// 		},
	// 		submit(event) {
	// 			if (this.loading) {
	// 				return
	// 			}
	// 			const {
	// 				errors,
	// 				value
	// 			} = event.detail
	// 			if (errors) return
	// 			if (value.password === value.passwordConfirmation) {
	// 				value.appName = this.appName
	// 				value.appid = this.appid
	// 				this.register(value)
	// 			} else {
	// 				this.errorMessage = '两次输入密码不相同'
	// 			}

	// 		},
	// 		confirmForm(name, value) {
	// 			this.binddata(name, value)
	// 			this.submitForm()
	// 		},
	// 		submitForm() {
	// 			this.errorMessage = ''
	// 			this.$refs.form.submit()
	// 		},
	// 		back() {
	// 			uni.redirectTo({
	// 				url: config.login.url
	// 			})
	// 		},
	// 		changePassword: function() {
	// 			this.showPassword = !this.showPassword;
	// 		},
	// 		changePasswordAgain: function() {
	// 			this.showPasswordAgain = !this.showPasswordAgain;
	// 		},
	// 		// #ifdef H5
	// 		// #ifndef VUE3
	// 		focus: function() {
	// 			this.$refs.usernameInput.$refs.input.focus()
	// 		}
	// 		// #endif
	// 		// #endif
	// 	}
	// }
</script>

<style>
	page {
		width: 100%;
		height: 100%;
		display: flex;
		/* align-items: center; */
		justify-content: center;
		background-color: #fff;
		/* #ifndef H5 */
		padding-top: 85px;
		/* #endif */
	}

	.login-box {
		position: relative;
		max-width: 420px;
		flex: 1;
		padding: 140px 35px 0;
		margin: 0 auto;
		overflow: hidden;
	}

	.uni-button {
		width: 184px;
	}
</style>
